<!--用户的订单页面-->
<template>
  <el-card shadow="never" class="aui-card--fill">
    <div >
      <el-form :inline="true" :model="dataForm" @keyup.enter.native="getDataList()">
        <el-form-item prop="id" style="margin-bottom: 0;">
          <el-input v-model="dataForm.id" placeholder="请输入订单编号" clearable></el-input>
<!--          <ComSelectPage ref="newPageSelect" @selectPageChange="e=>dataForm.id=e"-->
<!--                         :getUrl="{-->
<!--                          url:'/api/userOrder/page',-->
<!--                          method:'get',-->
<!--                          params:{page: 1,limit: 10,total: 0},-->
<!--                        }" :defaultValue="dataForm.id"-->
<!--                         clearable-->
<!--                         selectLabel="id"-->
<!--                         selectValue="id"-->
<!--                         selectLabelTwo="receiveName"-->
<!--                         searchLabel="receivePhone"-->
<!--                         placeholder="请选择订单（搜索请输入收件人电话"></ComSelectPage>-->
        </el-form-item>
        <el-form-item prop="userId">
          <el-input v-model="dataForm.userId" placeholder="请输入用户编号" clearable></el-input>
        </el-form-item>
        <el-form-item prop="receiveName" style="margin-bottom: 0;">
          <el-input v-model="dataForm.receiveName" placeholder="请输入收货人姓名" clearable></el-input>
        </el-form-item>
        <el-form-item prop="receivePhone" style="margin-bottom: 0;">
          <el-input v-model="dataForm.receivePhone" placeholder="请输入收货人电话" clearable></el-input>
        </el-form-item>
<!--        <el-form-item>-->
<!--          <el-date-picker-->
<!--              v-model="payDateList"-->
<!--              type="daterange"-->
<!--              placeholder="请选择支付日期"-->
<!--              format="yyyy 年 MM 月 dd 日"-->
<!--              range-separator="至"-->
<!--              start-placeholder="支付开始日期"-->
<!--              end-placeholder="支付结束日期"-->
<!--              value-format="yyyy-MM-dd"-->
<!--              class=""-->
<!--              @change="payCK"-->
<!--          />-->
<!--        </el-form-item>-->
<!--        <el-form-item>-->
<!--          <el-date-picker-->
<!--              v-model="createDateList"-->
<!--              type="daterange"-->
<!--              placeholder="请选择创建日期"-->
<!--              format="yyyy 年 MM 月 dd 日"-->
<!--              range-separator="至"-->
<!--              start-placeholder="订单开始日期"-->
<!--              end-placeholder="订单结束日期"-->
<!--              value-format="yyyy-MM-dd"-->
<!--              class=""-->
<!--              @change="createCK"-->
<!--          />-->
<!--        </el-form-item>-->
<!--        <el-form-item>-->
<!--          <el-date-picker-->
<!--              v-model="deliveryDateList"-->
<!--              type="daterange"-->
<!--              placeholder="请选择发货日期"-->
<!--              format="yyyy 年 MM 月 dd 日"-->
<!--              range-separator="至"-->
<!--              start-placeholder="发货开始日期"-->
<!--              end-placeholder="发货结束日期"-->
<!--              value-format="yyyy-MM-dd"-->
<!--              class=""-->
<!--              @change="deliveryCK"-->
<!--          />-->
<!--        </el-form-item>-->
<!--        <el-form-item>-->
<!--          <el-date-picker-->
<!--              v-model="takeDateList"-->
<!--              type="daterange"-->
<!--              placeholder="请选择收货日期"-->
<!--              format="yyyy 年 MM 月 dd 日"-->
<!--              range-separator="至"-->
<!--              start-placeholder="收货开始日期"-->
<!--              end-placeholder="收货结束日期"-->
<!--              value-format="yyyy-MM-dd"-->
<!--              class=""-->
<!--              @change="receiveCK"-->
<!--          />-->
<!--        </el-form-item>-->
<!--        <el-form-item>-->
<!--          <el-date-picker-->
<!--              v-model="settlementDateList"-->
<!--              type="daterange"-->
<!--              placeholder="请选择结算日期"-->
<!--              format="yyyy 年 MM 月 dd 日"-->
<!--              range-separator="至"-->
<!--              start-placeholder="结算开始日期"-->
<!--              end-placeholder="结算结束日期"-->
<!--              value-format="yyyy-MM-dd"-->
<!--              class=""-->
<!--              @change="settlementCK"-->
<!--          />-->
<!--        </el-form-item>-->
        <el-form-item style="margin-bottom: 0;">
          <el-button @click="getDataList()">查询</el-button>
        </el-form-item>
        <el-form-item style="margin-bottom: 0;" v-if="$hasPermission('api:exportOrder:export')">
          <el-button @click="exportHandle()" type="info">导出</el-button>
        </el-form-item>
<!--        <el-form-item prop="orderStatus" class="" style="width: 100%;">-->
<!--          <ren-radio-group-button-->
<!--              v-model="orderStatus"-->
<!--              dict-type="order_status"-->
<!--              placeholder="请选择订单状态"-->
<!--              :reName="getrename(other['根据状态统计'])"-->
<!--              @input="radioGroup"></ren-radio-group-button>-->
<!--        </el-form-item>-->
<!--        <el-form-item class="boder" style="width: 15%;">-->
<!--          <div class="flex_between flex_center" style="width: 100%;">-->
<!--            <div class="countBlock flex_columns flex_jufy_center" v-if="other['订单总数']">-->
<!--              <div class="countTitle">订单总数</div>-->
<!--              <div class="countValue" style="color: #5daf34">{{other['订单总数']}}</div>-->
<!--            </div>-->
<!--            <div class="countBlock flex_columns flex_jufy_center" v-if="other['销售额']">-->
<!--              <div class="countTitle">销售额</div>-->
<!--              <div class="countValue" style="color: #edcc29">￥{{formatNumber(other['销售额'])}}</div>-->
<!--            </div>-->
<!--          </div>-->
<!--          </el-form-item>-->
      </el-form>
      <div class="flex_between flex_center">
        <div>
          <ren-radio-group-button
              v-model="orderStatus"
              dict-type="order_status"
              placeholder="请选择订单状态"
              :reName="getrename(other['根据状态统计'])"
              @input="radioGroup"></ren-radio-group-button>
        </div>
        <div class="flex_rows flex_center " style="padding:0 0 10px;margin: 0;">
          <div class="countBlock flex_columns flex_jufy_center" v-if="other['订单总数']">
            <div class="countTitle">订单总数</div>
            <div class="countValue" style="color: #5daf34">{{other['订单总数']}}</div>
          </div>
          <div class="countBlock flex_columns flex_jufy_center" v-if="other['销售额']">
            <div class="countTitle">销售额</div>
            <div class="countValue" style="color: #f60404">￥{{formatNumber(other['销售额'])}}</div>
          </div>
        </div>
      </div>
      <el-table v-loading="dataListLoading" :data="dataList" stripe highlight-current-row
                @selection-change="dataListSelectionChangeHandle" @sort-change="dataListSortChangeHandle"
                style="width: 100%;" ref="multipleTable">
        <el-table-column type="selection" header-align="center" align="center" width="50"></el-table-column>
        <el-table-column prop="id" label="订单编号" header-align="center" align="center" width="150"></el-table-column>
        <el-table-column prop="userId" label="用户id" header-align="center" align="center" width="220">
          <template slot-scope="{}" slot="header">
            <!-- 表头名称 -->
            <span>用户信息</span>
            <el-tooltip class="item" effect="dark" placement="top">
              <i class="el-icon-question" style="font-size:16px;"></i>
              <!-- 悬停提示内容 -->
              <div slot="content">
                <div>点击下方名称查看用户详细信息</div>
              </div>
            </el-tooltip>
          </template>
          <template slot-scope="{row}">
            <div class="flex_columns" @click="showUserList(row['userDTO'])" v-if="row['userDTO']">
              <div class="flex_rows flex_center">
                <el-avatar size="large" :src="row['userDTO']['avatar']"></el-avatar>
                <div class="flex_columns" style="margin-left: 10px;">
                  <div class="flex_rows" style="text-decoration: underline;cursor: pointer;">ID:{{row['userDTO']['id']}}</div>
                  <div class="flex_rows flex_center" style="text-decoration: underline;cursor: pointer;">
                    <div class="ellipsis1" style="max-width: 4em;">
                      {{row['userDTO']['nickname']}}
                    </div>
                    ({{row['userDTO']['identity']}})
                  </div>
                </div>
              </div>
            </div>
            <div v-if="!row['userDTO']">{{row.userId}}</div>
          </template>
        </el-table-column>
        <el-table-column prop="seller" label="推广人员" header-align="center" align="center" width="220">
          <template slot-scope="{}" slot="header">
            <!-- 表头名称 -->
            <span>推广人员</span>
            <el-tooltip class="item" effect="dark" placement="top">
              <i class="el-icon-question" style="font-size:16px;"></i>
              <!-- 悬停提示内容 -->
              <div slot="content">
                <div>点击下方名称查看推广人员信息</div>
              </div>
            </el-tooltip>
          </template>
          <template slot-scope="{row}">
            <div class="flex_columns" @click="showUserList(row['sellerDTO'])" v-if="row['sellerDTO']">
              <div class="flex_rows flex_center">
                <el-avatar size="large" :src="row['sellerDTO']['avatar']" v-if="row['sellerDTO']['avatar']"></el-avatar>
                <div class="flex_columns" style="margin-left: 10px;">
                  <div class="flex_rows" style="text-decoration: underline;cursor: pointer;">ID:{{row['sellerDTO']['id']}}</div>
                  <div class="flex_rows flex_center" style="text-decoration: underline;cursor: pointer;">
                    <div class="ellipsis1" style="max-width: 4em;">
                      {{row['sellerDTO']['nickname']}}
                    </div>
                    ({{row['sellerDTO']['identity']}})
                  </div>
                </div>
              </div>
            </div>
            <div v-if="!row['sellerDTO']">暂无推广人员</div>
          </template>
        </el-table-column>
<!--        <el-table-column prop="deptId" label="公司信息" header-align="center" align="center"width="110">-->
<!--          <template slot-scope="{}" slot="header">-->
<!--            &lt;!&ndash; 表头名称 &ndash;&gt;-->
<!--            <span>公司信息</span>-->
<!--            <el-tooltip class="item" effect="dark" placement="top">-->
<!--              <i class="el-icon-question" style="font-size:16px;"></i>-->
<!--              &lt;!&ndash; 悬停提示内容 &ndash;&gt;-->
<!--              <div slot="content">-->
<!--                <div>点击下方名称查看公司信息</div>-->
<!--              </div>-->
<!--            </el-tooltip>-->
<!--          </template>-->
<!--          <template slot-scope="{row}">-->
<!--            <el-tag size="small" type="info" style="cursor: pointer;" @click="showDepartmentList(row.sysDeptDTO)" v-if="row.sysDeptDTO">{{row.sysDeptDTO.name}}</el-tag>-->
<!--            <div v-if="!row.sysDeptDTO">{{row.deptId}}</div>-->
<!--          </template>-->
<!--        </el-table-column>-->
        <el-table-column prop="orderStatus" label="订单状态" header-align="center" align="center"width="100">
          <template slot-scope="{row}">
            <el-tag v-if="row.orderStatus === 1" style="border: none;" color="#ffaa00" size="small" :hit="true" effect="dark" type="info">{{ $getDictLabel("order_status", row.orderStatus)}}</el-tag>
            <el-tag v-if="row.orderStatus === 2" style="border: none;" size="small" :hit="true" effect="dark" type="success">{{ $getDictLabel("order_status", row.orderStatus)}}</el-tag>
            <el-tag v-if="row.orderStatus === 3" style="border: none;" size="small" :hit="true" effect="dark" type="">{{ $getDictLabel("order_status", row.orderStatus)}}</el-tag>
            <el-tag v-if="row.orderStatus === 4" style="border: none;" color="#aa55ff" size="small" :hit="true" effect="dark" type="info">{{ $getDictLabel("order_status", row.orderStatus)}}</el-tag>
            <el-tag v-if="row.orderStatus === 5" style="border: none;" size="small" :hit="true" effect="dark" type="danger">{{ $getDictLabel("order_status", row.orderStatus)}}</el-tag>
            <el-tag v-if="row.orderStatus === 6" style="border: none;" color="#999999" size="small" :hit="true" effect="dark" type="info">{{ $getDictLabel("order_status", row.orderStatus)}}</el-tag>
            <el-tag v-if="row.orderStatus === 7" style="border: none;" color="#303030" size="small" :hit="true" effect="dark" type="info">{{ $getDictLabel("order_status", row.orderStatus)}}</el-tag>
            <el-tag v-if="row.orderStatus === 8" style="border: none;" color="#ff5500" size="small" :hit="true" effect="dark" type="info">{{ $getDictLabel("order_status", row.orderStatus)}}</el-tag>
            <el-tag v-if="row.orderStatus === 0" style="border: none;" size="small" :hit="true" effect="dark" type="warning">{{$getDictLabel("order_status", row.orderStatus)}}</el-tag>
          </template>
        </el-table-column>
        <el-table-column prop="payWay" label="支付方式" header-align="center" align="center"width="100">
          <template slot-scope="{row}">
            <div>{{ $getDictLabel("pay_way", row.payWay)}}</div>
          </template>
        </el-table-column>
        <el-table-column prop="itemDesc" label="商品信息" header-align="center" align="left" width="120" show-overflow-tooltip></el-table-column>
        <el-table-column prop="plateMakingFee" label="制版费" header-align="center" align="center" width="90" show-overflow-tooltip>
          <template slot-scope="{row}">
            <div>{{formatNumber(row.plateMakingFee)}}</div>
          </template>
        </el-table-column>
        <el-table-column prop="totalAmount" label="支付金额" header-align="center" align="center" width="90" show-overflow-tooltip>
          <template slot-scope="{row}">
            <div>{{formatNumber(row.totalAmount)}}</div>
          </template>
        </el-table-column>
<!--        <el-table-column prop="totalPoints" label="获赠积分" header-align="center" align="center" width="" show-overflow-tooltip>-->
<!--          <template slot-scope="{row}">-->
<!--            <div>{{formatNumber(row.totalPoints)}}</div>-->
<!--          </template>-->
<!--        </el-table-column>-->
        <el-table-column prop="receiveName" label="收件人姓名" header-align="center" align="center" width="120" show-overflow-tooltip></el-table-column>
        <el-table-column prop="receivePhone" label="收件人电话" header-align="center" align="center" width="120" show-overflow-tooltip></el-table-column>
<!--        <el-table-column prop="receiveProvince" label="所在省份" header-align="center" align="center"width=""show-overflow-tooltip></el-table-column>-->
<!--        <el-table-column prop="receiveCity" label="所在城市" header-align="center" align="center"width=""show-overflow-tooltip></el-table-column>-->
<!--        <el-table-column prop="receiveCounty" label="所在区县" header-align="center" align="center"width=""show-overflow-tooltip></el-table-column>-->
        <el-table-column prop="receiveAddress" label="收件人地址" header-align="center" align="center" width="180">
          <template slot-scope="{row}">
            <el-tooltip effect="dark" :content="row.receiveProvince+row.receiveCity+row.receiveCounty+row.receiveAddress" placement="top">
              <div class="ellipsis1">{{ row.receiveProvince }}{{ row.receiveCity }}{{ row.receiveCounty }}{{ row.receiveAddress }}</div>
            </el-tooltip>
          </template>
        </el-table-column>
        <el-table-column prop="invoice" label="发票信息" header-align="center" align="center" width="130">
          <template slot-scope="{}" slot="header">
            <!-- 表头名称 -->
            <span>发票信息</span>
            <el-tooltip class="item" effect="dark" placement="top">
              <i class="el-icon-question" style="font-size:16px;"></i>
              <!-- 悬停提示内容 -->
              <div slot="content">
                <div>点击下方查看发票信息</div>
              </div>
            </el-tooltip>
          </template>
          <template slot-scope="{row}">
            <el-tag size="small" type="warning" style="cursor: pointer;" @click="showInvoiceList(row.orderInvoiceInfoDTO)" v-if="row.orderInvoiceInfoDTO">{{row.invoice}}</el-tag>
            <div v-if="!row.orderInvoiceInfoDTO">{{row.invoice}}</div>
          </template>
        </el-table-column>
        <el-table-column prop="remark" label="订单备注" header-align="center" align="center" width="100" show-overflow-tooltip>
          <template slot-scope="{row}">
            <el-tooltip effect="dark" :content="row.remark" placement="top" v-if="row.remark">
              <div>{{ row.remark }}</div>
            </el-tooltip>
            <div v-else>未填写</div>
          </template>
        </el-table-column>
        <el-table-column prop="createDate" label="创建时间" header-align="center" align="center" width="150"></el-table-column>
        <el-table-column prop="makingFeeDate" label="制版费付款时间" header-align="center" align="center" width="150"></el-table-column>
        <el-table-column prop="payDate" label="尾款/付款时间" header-align="center" align="center" width="150"></el-table-column>
        <el-table-column prop="deliveryDate" label="发货时间" header-align="center" align="center" width="150"></el-table-column>
        <el-table-column prop="receiveDate" label="收货时间" header-align="center" align="center" width="150"></el-table-column>
        <el-table-column prop="settlementDate" label="结算时间" header-align="center" align="center" width="150"></el-table-column>
        <el-table-column label="操作" fixed="right" header-align="center" align="center" width="240">
          <template slot-scope="{row}">
            <div class="flex_wrap flex_row_reverse">
              <el-dropdown trigger="click"  @command="operateDropdownCk">
                <div class="el-dropdown-link demonstration" >
                  <el-link type="primary"><i class="el-icon-more"></i></el-link>
                </div>
                <el-dropdown-menu slot="dropdown">
<!--                  <el-dropdown-item-->
<!--                      :command="{title:'发货',item:{...row}}"-->
<!--                      v-if="$hasPermission('api:uploadShippingInfo:save') && row.orderStatus === 1"-->
<!--                  >发货</el-dropdown-item>-->
                  <el-dropdown-item
                      :command="{title:'评论',item:row.id}"
                  >评论</el-dropdown-item>
                  <el-dropdown-item
                      :command="{title:'关联退款',item:row.id}"
                      v-if="row.orderStatus===4||row.orderStatus===5"
                  >关联退款</el-dropdown-item>
                  <el-dropdown-item
                      :command="{title:'生产完成',item:row.id}"
                      v-if="row.orderStatus===7"
                  >生产完成</el-dropdown-item>
<!--                  <el-dropdown-item-->
<!--                      :command="{title:'关联发票',item:row.id}"-->
<!--                      v-if="$hasPermission('api:orderInvoiceInfo:page')"-->
<!--                  >关联发票</el-dropdown-item>-->
                </el-dropdown-menu>
              </el-dropdown>
              <el-link v-if="$hasPermission('api:userOrder:update')"
                       @click="addOrUpdateHandle(row.id)"
                       type="primary">修改
              </el-link>
              <el-link @click="UploadShippingInfoHandle(row)"
                       type="primary"
                       v-if="$hasPermission('api:uploadShippingInfo:save') && row.orderStatus === 1">发货
              </el-link>
              <el-link  v-if="$hasPermission('api:getOrder:query')"
                        type="primary"
                        @click="getOrderList(row)">详情</el-link>
              <el-link  v-if="$hasPermission('api:getOrder:query') && row['userDTO']['id']"
                        type="primary"
                        @click="getQrCode(row)">查看二维码</el-link>
<!--              <el-link type="primary"-->
<!--                       @click="getEdouInfo(row.id)">奖励</el-link>-->
<!--              <el-link type="primary"-->
<!--                       @click="getCommentInfo(row.id)">评论</el-link>-->
<!--              <el-link v-if="row.orderStatus===4||row.orderStatus===5"-->
<!--                       type="primary"-->
<!--                       @click="getRefundInfo(row.id)">关联退款</el-link>-->
<!--              <el-link v-if="$hasPermission('api:orderInvoiceInfo:page')"-->
<!--                       type="primary"-->
<!--                       @click="getOrderInvoiceInfo(row.id)">关联发票</el-link>-->

            </div>
          </template>
        </el-table-column>

      </el-table>
      <el-pagination :current-page="page" :page-sizes="[10, 20, 50, 100]" :page-size="limit" :total="total"
                     layout="total, sizes, prev, pager, next, jumper" @size-change="pageSizeChangeHandle"
                     @current-change="pageCurrentChangeHandle">
      </el-pagination>
      <!--二维码弹窗-->
      <el-dialog
          title="提示"
          :visible.sync="isQr"
          width="70%">
        <div class="flex_jufy_center" style="margin-right: 10px;">
          <el-image
              style="width: 400px; height: 400px;border-radius: 5px;"
              :src="qRcontent"
              :preview-src-list="[qRcontent]" v-if="qRcontent"></el-image>
        </div>
        <span slot="footer" class="dialog-footer">
          <el-button @click="isQr = false">取 消</el-button>
          <el-button type="primary" @click="isQr = false">确 定</el-button>
        </span>
      </el-dialog>
      <!-- 弹窗, 新增 / 修改 -->
      <add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update>
      <!--发货信息-->
      <upload-shipping-info v-if="isUploadShippingInfo" ref="UploadShippingInfo" @cancellation="$refs.multipleTable.clearSelection()" @refreshDataList="getDataList"></upload-shipping-info>
      <!--商品详情-->
      <user-order-product-list v-if="isUserOrderProductList" ref="UserOrderProductList" @cancellation="$refs.multipleTable.clearSelection()"></user-order-product-list>
      <!--查看用户信息组件-->
      <com-user-list :visible.sync="showUser" :content="content"></com-user-list>
      <!--查看公司信息组件-->
      <com-department-list :visible.sync="showDepartment" :content="content"></com-department-list>
      <!--查看发票组件-->
      <com-invoice-list :visible.sync="showInvoice" :content="content" @cancellation="$refs.multipleTable.clearSelection()"></com-invoice-list>
    </div>

  </el-card>
</template>

<script>
import mixinViewModule from '@/mixins/view-module'
import AddOrUpdate from './userOrderAddOrUpdate.vue'
import UploadShippingInfo from './userOrderUploadShippingInfo.vue'//订单发货
import UserOrderProductList from './userOrderProductList.vue'
import {formatNumber, getDictValue, getDictValue2} from "@/utils";
//微信订单
export default {
  mixins: [mixinViewModule],
  data() {
    return {
      isUploadShippingInfo: false,        //发货按钮
      isUserOrderGetOrder: false,         //微信订单弹窗
      isUserOrderProductList: false,      //订单详情弹窗
      isQr: false,                        //二维码按钮
      mixinViewModuleOptions: {
        getDataListURL: '/api/userOrder/page',
        getDataListIsPage: true,
        createdIsNeed: false,            // 此页面是否在创建时，调用查询数据列表接口？
        deleteURL: '/api/userOrder',
        deleteIsBatch: true,
        exportURL: '/api/userOrder/exportOrder' // 导出接口，API地址
      },
      showUser:false,                   //是否显示用户信息
      showDepartment:false,             //是否显示公司信息
      showInvoice:false,                //是否显示发票信息
      content:{},                       //用户信息内容
      qRcontent:{},                     //二维码信息内容
      createDateList: [],               //创建时间数组
      deliveryDateList: [],             //发货时间数组
      payDateList: [],                  //支付时间数组
      takeDateList: [],                 //收货时间数组
      settlementDateList: [],           //结算时间数组
      orderStatus: '',                  //自定义订单状态，如待付款、已支付、已发货、已完成等
      dataForm: {
        id: '',                         //订单id
        userId:'',                      //用户id
        createDateStart: '',            //开始创建时间
        createDateEnd: '',              //结束创建时间
        deliveryDateStart:'',           //开始发货时间
        deliveryDateEnd: '',            //结束发货时间
        deliveryNumber: '',             //配送单号
        dtlId: '',                      //订单明细
        orderStatus: '',                //订单的当前状态，如待付款、已支付、已发货、已完成等
        payDate: '',                    //付款时间
        payDateStart: '',               //开始付款时间
        payDateEnd: '',                 //结束付款时间
        receiveDate: '',                //收货时间
        receiveDateStart: '',           //开始收货时间
        receiveDateEnd: '',             //结束收时间
        settlementDate: '',             //结算时间
        settlementDateStart: '',        //开始结算时间
        settlementDateEnd: '',          //结束结算时间
        receiveName: '',                //记录收货人的姓名。
        receivePhone: '',               //记录收货人的手机号码
        receiveProvince: '',            //记录收货地址所在的省、州或自治区
        receiveCity: '',                //记录收货地址所在的城市
        receiveCounty: '',              //记录收货地址所在的区县
        receiveAddress:'',              //记录详细的街道地址，如门牌号、楼层等
        remark: '',                     //用户对订单的附加说明或备注信息
        totalAmount: '',                //订单的总金额，等于商品价格乘以购买数量
        totalPoints: '',                //平台积分
        itemDesc:'',                    //商品信息
        invoice:'',                     //是否需要发票
        payWay:'',                      //支付方式
      },
      other:{},                         //统计数据
      timeList:[]                       //时间戳数组

    }
  },
  watch: {
    '$route':'getPath'
  },
  components: {
    AddOrUpdate,
    UploadShippingInfo,
    UserOrderProductList
  },
  created() {
  },
  mounted() {
    if (this.$route.query.userId){
      this.mixinViewModuleOptions.createdIsNeed = false
      this.dataForm.userId = this.timeList.includes(this.$route.query.time)?'': this.$route.query.userId
      this.getDataList()//查询数据
    }else {
      this.mixinViewModuleOptions.createdIsNeed = true
      this.getDataList()//查询数据
    }
    this.timeList.push(this.$route.query.time)
  },
  methods: {
    formatNumber,
    ArrayBufferToBase64(buffer) {
      //第一步，将ArrayBuffer转为二进制字符串
      var binary = '';
      var bytes = new Uint8Array(buffer);
      for (var len = bytes.byteLength, i = 0; i < len; i++) {
        binary += String.fromCharCode(bytes[i]);
      }
      //将二进制字符串转为base64字符串
      return window.btoa(binary);
    },
    //获取下单用户二维码
    getQrCode(item){
      console.log(item)
      this.$http['get'](`/api/userOrder/personalCard/${item['userDTO']['id']}`,{responseType: 'arraybuffer'}).then(({data: res}) => {
        // console.log(res)
        if (res.code !== 0) {
          this.$message.error(res.msg)
        }
        const src = this.ArrayBufferToBase64(res)
        this.qRcontent = "data:image/png;base64,"+src
        // console.log(this.qRcontent)
        this.isQr = true
      }).catch((err) => {
        console.log(err)
      })
    },
    //获取数据列表
    getrename(name){
      if (!name){
        return new Map()
      }
      return new Map(Object.entries(name));
    },
    //监听路由变化
    getPath(){
      if (this.$route.query.userId){
        this.mixinViewModuleOptions.createdIsNeed = false
        this.dataForm.userId = this.timeList.includes(this.$route.query.time)?'': this.$route.query.userId
        this.getDataList()//查询数据
      }else {
        this.mixinViewModuleOptions.createdIsNeed = true
        this.dataForm.userId = ''
        this.getDataList()//查询数据
      }
      this.timeList.push(this.$route.query.time)
    },
    // 订单状态变化
    radioGroup(e){
      this.dataForm['orderStatus'] = getDictValue2("order_status",e)
      this.getDataList()
    },
    /*创建时间选择*/
    createCK() {
      if (!this.createDateList){
        this.dataForm.createDateStart = ''
        this.dataForm.createDateEnd = ''
        return
      }
      this.dataForm.createDateStart = this.createDateList[0]
      this.dataForm.createDateEnd = this.createDateList[1]
    },
    /*发货时间选择*/
    deliveryCK() {
      if (!this.deliveryDateList){
        this.dataForm.deliveryDateStart = ''
        this.dataForm.deliveryDateEnd = ''
        return
      }
      this.dataForm.deliveryDateStart = this.deliveryDateList[0]
      this.dataForm.deliveryDateEnd = this.deliveryDateList[1]
    },
    /*收货时间选择*/
    receiveCK() {
      if (!this.takeDateList){
        this.dataForm.receiveDateStart = ''
        this.dataForm.receiveDateEnd = ''
        return
      }
      this.dataForm.receiveDateStart = this.takeDateList[0]
      this.dataForm.receiveDateEnd = this.takeDateList[1]
    },
    /*结算时间选择*/
    settlementCK() {
      if (!this.settlementDateList){
        this.dataForm.settlementDateStart = ''
        this.dataForm.settlementDateEnd = ''
        return
      }
      this.dataForm.settlementDateStart = this.settlementDateList[0]
      this.dataForm.settlementDateEnd = this.settlementDateList[1]
    },
    /*支付时间选择*/
    payCK() {
      if (!this.payDateList){
        this.dataForm.payDateStart = ''
        this.dataForm.payDateEnd = ''
        return
      }
      this.dataForm.payDateStart = this.payDateList[0]
      this.dataForm.payDateEnd = this.payDateList[1]
    },
    //
    UploadShippingInfoHandle(item){
      this.$refs.multipleTable.toggleRowSelection(item);
      this.isUploadShippingInfo = true
      this.$nextTick(() => {
        this.$refs.UploadShippingInfo.dataForm.id = item.id
        this.$refs.UploadShippingInfo.dataForm.logisticsType = item.logisticsType
        this.$refs.UploadShippingInfo.init()
      })
    },
    //查看订单信息
    getOrderList(item){
      this.$refs.multipleTable.toggleRowSelection(item);
      this.isUserOrderProductList = true
      this.$nextTick(() => {
        this.$refs.UserOrderProductList.dataForm.id = item.id
        this.$refs.UserOrderProductList.init()
      })
    },
    /*查看用户奖励*/
    getEdouInfo(id){
      this.$router.push({path: `/service-userAccountEdou`,query:{formId:id,time:new Date().getTime()}})
    },
    /*查看订单评论*/
    getCommentInfo(id){
      this.$router.push({path: `/service-productComment`,query:{orderId:id,time:new Date().getTime()}})
    },
    /*查看退货订单*/
    getRefundInfo(id){
      this.$router.push({path: `/service-userRefund`,query:{orderId:id,time:new Date().getTime()}})
    },
    /*查看发票*/
    getOrderInvoiceInfo(id){
      this.$router.push({path: `/service-orderInvoiceInfo`,query:{orderId:id,time:new Date().getTime()}})
    },
    //显示用户信息
    showUserList(content){
      this.showUser=true;
      this.content= content;
    },
    //显示公司信息
    showDepartmentList(content){
      this.showDepartment=true;
      this.content= content;
    },
    //显示发票信息
    showInvoiceList(content){
      // console.log(content);
      this.showInvoice=true;
      this.content= content;
    },
    //修改订单为已发货
    uploadShippingInfoHandle(id){
      this.$confirm(`确定对订单[id=${id}]设计完成操作?`, '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }
      ).then(() => {
        let data={
          id:id,
          orderStatus:1,
        }
        this.$http['put']('/api/userOrder', data).then(({data: res}) => {
              if (res.code !== 0) {
                return this.$message.error(res.msg)
              }
              this.$message({
                message: this.$t('prompt.success'),
                type: 'success',
                duration: 500,
                onClose: () => {
                  this.getDataList()
                }
              })
            }).catch(() => {})
      }
      ).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消操作'
        }
        );
      }
      );
    },
    filterColon(str) {
      return str.replace('"', '');
    },
    //操作栏下拉框选择
    operateDropdownCk(command) {
      if(command['title']==='发货'){
        this.UploadShippingInfoHandle(command['item'])
      }
      if(command['title']==='评论'){
        this.getCommentInfo(command['item'])
      }
      if(command['title']==='关联退款'){
        this.getRefundInfo(command['item'])
      }
      if(command['title']==='关联发票'){
        this.getOrderInvoiceInfo(command['item'])
      }
      if(command['title']==='生产完成'){
        this.uploadShippingInfoHandle(command['item'])
      }
    }
  }
}
</script>
<style lang="scss">
.el-button{
  margin-bottom: 10px;
  margin-left: 10px;
}
.countBlock{
  min-width: 100px;
  background-color: #FFFFFF;
  margin-right: 10px;
  line-height: normal; /* 默认值为normal，表示自动调整 */
  border-radius: 5px;
  //阴影
  //box-shadow: 0 2px 4px rgba(0, 0, 0, .03), 0 0 6px rgba(0, 0, 0, .04);
}
.countTitle{
  margin-right: 10px;
}
.countValue{
  font-size: 20px;
}
</style>
